<template>
    <div class="ExportXunjianWrap">
        <a-button @click="handClick" :loading="loading">巡检记录导出</a-button>
        <a-modal title="巡检记录导出" :visible="visible" :confirm-loading="confirmLoading" @ok="handleOk"
            :maskClosable="false" @cancel="handleCancel" :width="720">
            <a-form :form="form" :label-col="{ span: 2 }" :wrapper-col="{ span: 22 }">
                <a-form-item label="公司">
                    <span style="width: 100%;margin-left: 12px;">{{ treeKey.label }} </span>
                </a-form-item>
                <a-form-item label="时间">
                    <a-range-picker style="width: 100%;" v-decorator="[
                        'date',
                        { rules: [{ required: true, message: '请选择导出时间' }] },
                    ]" placeholder="请选择导出时间" />

                </a-form-item>
            </a-form>
        </a-modal>
    </div>
</template>
<script>
import moment from "moment";
import qs from "qs";
export default {
    name: 'ExportXunjian',
    props: {
        aParams: {
            type: Object,
        },
        menuId: {
            type: [String, Number],
        },
        treeKey: {
            type: Object,
        }
    },
    data() {
        return {
            loading: false,
            visible: false,
            confirmLoading: false,
            form: this.$form.createForm(this, { name: 'coordinated' }),
        }
    },
    methods: {
        handClick() {
            // this.getQuest();
            if (!this.aParams['company']) {
                this.$message.error("请选择左侧公司");
                return;
            }
            this.visible = true;
        },
        handleCancel() {
            this.visible = false;
            this.form.resetFields();
        },
        handleOk() {
            this.form.validateFieldsAndScroll((err, values) => {
                if (!err) {
                    let formData = values;
                    let params = {
                        ...this.aParams,
                    }
                    if (Array.isArray(formData['date']) && formData['date'].length > 0) {
                        params['startTime'] = moment(formData['date'][0]).format('YYYY-MM-DD')
                        params['endTime'] = moment(formData['date'][1]).format('YYYY-MM-DD')
                    }
                    Object.keys(params).filter(v => {
                        if (!['startTime', 'endTime', 'company'].includes(v)) {
                            delete params[v];
                        }
                    })
                    let tempUrl = this.$mhqtzInspectionRecordExport;

                    const timestamp = new Date().getTime();
                    this.$notification.open({
                        key: timestamp,
                        duration: null,
                        message: "提示",
                        icon: '',
                        description: (
                            <div>
                                <span>导出中，请稍后</span>
                            </div>
                        ),
                        onClick: () => { },
                    });
                    this.loading = true;
                    let str = qs.stringify(params);
                    let link = document.createElement("a");
                    link.style.display = "none";
                    // 兼容不同浏览器的URL对象
                    const url = window.URL || window.webkitURL || window.moxURL;
                    link.href = `${tempUrl}?${str}`;
                    link.setAttribute("download", `导出测试.xlsx`);
                    document.body.appendChild(link);
                    link.click();
                    document.body.removeChild(link);
                    url.revokeObjectURL(link.href);
                    setTimeout(() => {
                        this.$notification.close(timestamp)
                        this.loading = false;
                        this.visible = false;
                        this.form.resetFields();
                    }, 1500)
                }
            });


        }
    }
}
</script>
<style lang="less" scoped>
.ExportXunjianWrap {}
</style>